<!--
 * @Author: @miao-xiongmei 2575733397@qq.com
 * @Date: 2022-07-15 15:04:47
 * @LastEditors: @miao-xiongmei 2575733397@qq.com
 * @LastEditTime: 2022-07-17 13:30:46
 * @FilePath: \tainfuhealh\src\components\bookingManagement\paging.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div class="block">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
            :current-page="userInfo.page" :page-sizes="[5, 10, 15, 20]" :page-size="userInfo.limit"
            layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>
    </div>
</template>

<script>
export default {
    props: ['total', 'userInfo'],
    methods: {
        handleSizeChange(val) {
            // console.log(`每页 ${val} 条`);
            this.userInfo.limit = val
            this.$parent.getAll()

        },
        handleCurrentChange(val) {
            // console.log(`当前页: ${val}`);
            this.userInfo.page = val;
            this.$parent.getAll()

        },
    },
    data() {
        return {
            currentPage: 1
        };
    }
}
</script>

<style>
.block {
    float: right;
    margin-top: 30px;
}
</style>